<template>
	<view class="container">
		<uni-fab ref="fab" :pattern="pattern" :content="content" horizontal="left" vertical="bottom" direction="vertical" @trigger="trigger" @fabClick="fabClick" />
	</view>
</template>

<script>
export default {
	components: {},
	props:{
		groupId:{
			type:String,
			default:''
		}
	},
	data() {
		return {
			pattern: {
				color: '#7A7E83',
				backgroundColor: '#fff',
				selectedColor: '#007AFF',
				buttonColor: '#007AFF',
				iconColor: '#fff'
			},
			is_color_type: false,
			content: [
				{
					iconPath: '/static/shoping.png',
					selectedIconPath: '/static/image-active.png',
					text: '购物',
					active: false
				},
				{
					iconPath: '/static/nofly.png',
					selectedIconPath: '/static/home-active.png',
					text: '周边',
					active: false
				},
				{
					iconPath: '/static/adressBook.png',
					selectedIconPath: '/static/star-active.png',
					text: '收藏',
					active: false
				}
			]
		};
	},
	onBackPress() {
		if (this.$refs.fab.isShow) {
			this.$refs.fab.close();
			return true;
		}
		return false;
	},
	methods: {
		trigger(e) {
			console.log('.....', e);
			switch (e.index) {
			  case 0:
			    const aa={
					action:"buy",
					groupId:this.groupId
				}
			const 	type=encodeURIComponent(JSON.stringify(aa))
			    uni.navigateTo({
			      url: `/pages/shopping/shopping?type=${type}`
			    });
			    break; 
			    
			  case 1:
			    uni.navigateTo({
			      url: '/pages/setDistance/setDistance'
			    });
			    break;
			    
			  case 2:
			    uni.navigateTo({
			      url: '/pages/contacts/contacts'
			    });
			    break;
			    
			  default:
			    console.warn('未定义的索引:', e.index);
			
			}
		},
		fabClick() {
	
		}

	}
};
</script>

<style lang="scss">
.container {
	position: fixed;
	left: 10rpx;
	bottom: 80rpx;
}
.warp {
	padding: 10px;
}

.button {
	margin-bottom: 20px;
}
</style>
